<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/paris.css"/>
	</head>
	<body>
		<div id="modify">
            <span>编号:<span id="num1"></span></span> <br>
                名称：<input type="text" id="name1"><br>
                价格：<input type="text" id="price1"><br>
                品牌：<input type="text" id="brand1"><br>
                库存：<input type="text" id="inventory1"><br>
                <button id="add1">确定</button>
                </div>
	<div class="quan">
	<table class="aiya">
		<h1 class="aiyo">亲QAQ，所有东西都在这里啦！</h1>
		      <div class="pop" id="pop">
            
               
                名称：<input type="text" id="name"><br>
                价格：<input type="text" id="price"><br>
                品牌：<input type="text" id="brand"><br>
                库存：<input type="text" id="inventory"><br>
                <button id="add">确定</button>
              
            </div> 
   	 		<thead>
        	<tr>
        		<div class="po">
        		 来试试<a href='javascript:;'id="btn1">新增</a>吧！</div>
        		 <th>操作</th>
           		 <th>编号</th>
            	 <th>名称</th>
           		 <th>$</th>
           		 <th>品牌</th>
           		 <th>库存</th>
           		 <div class="do">
           		 不喜欢就<a href="javascript:;" id="btn2">删掉</a>吧!</div>
        </tr>
    </thead>
    <tbody>
    </tbody>
		</table>
     <food id="foot">
         <span id="total"></span>
         <span id="page"></span>
         <a  id="first">首页</a>
         <a  id="prev">上一页</a>
         <a  id="next">下一页</a>
         <a  id="last">尾页</a>
        </food>
		</div>
	</body>
	<script src="jquery-1.11.2.min.js"></script>
	<script>

var pagenum=1;//当前页数
var totalcount=0;//总条数
var pagecount=0;//每页条数
var maxnum=0;//最大页数
function addlist(){
    $.get('list',function(arr){
      totalcount=arr.length;
      pagecount=5;
      maxnum=Math.ceil(totalcount/pagecount)
      $('#page').html(pagenum+"/"+maxnum)
      $('#total').html('共'+totalcount+'条记录')

      
       for(var i=(pagenum-1)*5;i<=pagenum*5-1;i++){
            var l=arr[i];
            var tr=$('<tr></tr>');
            $('<td><input type="checkbox" class="check"></td>').appendTo(tr);
            $('<td>'+l.number+'</td>').appendTo(tr);
            $('<td>'+l.name+'</td>').appendTo(tr);
            $('<td>'+l.price+'</td>').appendTo(tr);
            $('<td>'+l.brand+'</td>').appendTo(tr);
            $('<td>'+l.inventory+'</td>').appendTo(tr);
            $('<td><a hred="javascript:;" class="set">修改</a></td>').appendTo(tr);
            tr.appendTo('tbody')
        }
        
    })}
   addlist()

    $('#btn1').click(function(){
        if( $('#pop').width()==0){
        $('#pop').animate({
            left:$(document).width()/5,
            top:$(document).height()/8,
            width:250,
            height:350
        },500)
        
        }else{
             $('#pop').animate({
            left:0,
            top:0,
            width:0,
            height:0

        },500)
    }
})
$('#add').click(function(){
    var na=$('#name').val();
    var p=$('#price').val();
    var br=$('#brand').val();
    var i=$('#inventory').val();
    var per={name:na,price:p,brand:br,inventory:i}
    $.get('ad',per,function(data){
        if(data=='a'){
              $('#pop').animate({
            left:0,
            top:0,
            width:0,
            height:0

        },500,function(){
         location.reload()
        })
           
        }else{
            alert('add fila')
        }
    })
})
$(document).on('click','.set',function(){
    if( $('#modify').width()==0){
        $('#modify').animate({
            left:$(document).width()/4,
            top:$(document).height()/10-90,
            width:250,
            height:350
        },500)
        
        }else{
             $('#modify').animate({
            left:0,
            top:0,
            width:0,
            height:0

        },500)
    }
    var num=$(this).parents('tr').children().eq(1).html()
    var n=$(this).parents('tr').children().eq(2).html()
    var p=$(this).parents('tr').children().eq(3).html()
    var b=$(this).parents('tr').children().eq(4).html()
    var i=$(this).parents('tr').children().eq(5).html()
    $('#num1').html(num)
    $('#name1').val(n)
    $('#price1').val(p)
    $('#brand1').val(b)
    $('#inventory1').val(i)
})
$('#add1').click(function(){
    var num= $('#num1').html()
    var n= $('#name1').val()
    var p=$('#price1').val()
    var b=$('#brand1').val()
    var i= $('#inventory1').val()
    var papapa={number:num,name:n,price:p,brand:b,inventory:i}
    $.get('modify',papapa,function(data){
      if(data=='a'){
            $('#modify').animate({
            left:0,
            top:0,
            width:0,
            height:0

        },500,function(){
         location.reload()
        })
        
      }else{
          alert('修改失败')
      }
    })
})
   $('#btn2').click(function(){
       var che=$('.check')
       var arr=[];
      for(var i=0;i<che.length;i++){
          if(che[i].checked==true){
              var s=$(che[i]).parent().next().html();
             
              arr.push(s)
              
          }
      }
      var a={name:arr}
      $.get('dele',a,function(data){
          if(data=='s'){
               location.reload()
          }else{
              alert('删除失败')
          }
      })
   })
   $('#btn3').click(function(){
       var inp=$('#inp11').val()
      
     $.get('search',{id:inp},function(arr){
         $('tbody').html('')
         if(arr!=[]){
         for(var i=0;i<arr.length;i++){
            var l=arr[i];
            var tr=$('<tr></tr>');
            $('<td><input type="checkbox" class="check"></td>').appendTo(tr);
            $('<td>'+l.number+'</td>').appendTo(tr);
            $('<td>'+l.name+'</td>').appendTo(tr);
            $('<td>'+l.price+'</td>').appendTo(tr);
            $('<td>'+l.brand+'</td>').appendTo(tr);
            $('<td>'+l.inventory+'</td>').appendTo(tr);
            $('<td><a hred="javascript:;" class="set">修改</a></td>').appendTo(tr);
            tr.appendTo('tbody')
        
        }}else{
            alert('辣鸡走开')
        }
     })
   })

$('#prev').click(function(){
   
    if(pagenum>1){
         $('tbody').html('')
        pagenum--;
       addlist()
    }
})
$('#first').click(function(){
   $('tbody').html('')
        pagenum=1;
        addlist()
    
})
$('#last').click(function(){
    $('tbody').html('')
        pagenum=maxnum;
        addlist()
    
})
$('#next').click(function(){
   
    if(pagenum<maxnum){
         $('tbody').html('')
        pagenum++;
        addlist()
    }
})
	</script>
</html>
